<template>
  <nav>
    <ul>
        <li>
            <router-link :to="{name : 'AddPerson'}"> 添加人员</router-link>
        </li>
         <li>
            <router-link :to="{name : 'ListPerson'}"> 人员列表</router-link>
        </li>
        <li>
              <router-link :to="{name : 'ShoolList'}"> 学校列表</router-link>
        </li>
          <li>
              <router-link :to="{name : 'ProductList'}"> 商品列表</router-link>
        </li>
    </ul>
  </nav>
</template>

<script>
export default {
    name : 'HomeSlide',
}
</script>

<style scoped>
    nav{
        width: 20%;
        height: 100vh;
        background-color:rgb(123, 197, 123);
        display: flex;
        justify-content: center;
    }
    nav ul{
        width: 80%;
        margin-top: 50px;
    }
    nav ul li a{
        display: block;
        width: 100%;
        height: 50px;
        color: white;
        font-weight: 800;
        text-align: center;
        line-height: 50px;
    }
    nav ul li .router-link-active{
        border-bottom: 2px solid white;
        font-size: 14px;
    }
</style>